<template>
  <div class="container">
    <div class="headFont">
      <span class="spanDiv"></span>
      <span class="spanFont">学员管理</span>
    </div>
    <Search @searchParent='searchFn(arguments)'/>
    <Table :arr='arr' @resetFn='getData' @parentopen='openDia'/>
    <Dialog v-if="isShow" :row='row'/>
    <List :total="total" />
    
  </div>
</template>

<script>
import Search from './components/Search.vue'
import Table from './components/Table.vue'
import List from './components/List.vue'
import Dialog from './components/Dialog.vue'
import {getHome} from '../../api/teacherHome'
export default {
  components:{Search,Table,List,Dialog},
  data() {
    return {
      arr:[],
      search:'',
      pageSize:10,
      page:1,
      total:0,
      isShow:false,
      row:{},
      date1:'',
      date2:''
    }
  },
  mounted() {
    this.getData()
  },
  beforeDestroy() {
    this.getData()
  },
  methods: {
  openDia(row){
    this.isShow= true,
    this.row = row
  },
  getData(){
    const params = {
      search:this.search,
      date1:this.date1,
      date2:this.date2,
      pageSize:this.pageSize,  //每页多少条
      page:this.page //页码
    }
    getHome( params ).then(res=>{
      if(res.code==200){
        this.arr = res.data,
        this.total = res.total
      }
    })
   },
  searchFn(val){
    this.search = val[0]
    this.date1 = val[1]
    this.date2 = val[2]
    this.getData()
   }
  },
}
</script>

<style lang="less" scoped>
  .headFont{
    font-size: 20px;
    padding: 20px;
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    color: #333333;
    box-sizing: border-box;
    line-height: 30px;
    position: relative;
    >.spanDiv{
      background-color: #438afe;
      display: inline-block;
      height: 20px;
      width: 5px;
      z-index: inherit;
      position: absolute;
      left: 0px;
      top: 25px;
    }
  }
</style>